<html>
<head>
  <title>WebChat | 登陆</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link href="/view/statics/source/css/login.css" rel='stylesheet' type='text/css' />
  <script src="/view/statics/plugins/jquery/jquery-2.1.4.min.js"></script>
  <script src="/view/statics/plugins/layer/layer.js"></script>
</head>
<body>

<h1>WebChat</h1>
<div class="login-form">
  <div class="close"> </div>
  <div class="head-info">
    <label class="lbl-1"></label>
    <label class="lbl-2"></label>
    <label class="lbl-3"></label>
  </div>
  <div class="clear"> </div>
  <div class="avtar"><img src="/view/statics/source/img/avtar.png" alt="点我注册"/></div>

    <div class="key">
      <input type="text" id="userid" name="userid" placeholder="请输入账号" >
    </div>

    <div class="key">
      <input type="password" id="password" name="password" placeholder="请输入密码">
    </div>
     
   
    <div style="height:70px;">  
     <div class="signin" style="float:left;width:50%;">
      <input type="submit" id="Login" value="Login" onclick="checkLoginForm()" />
    </div>   
     <div class="signin" style="float:left;width:50%;">
      <input type="submit" id="Register" value="Register" />
    </div>    
    </div>

</div>

<script>
  

  /**
   * check the login form before user login.
   * @returns {boolean}
   */
  function checkLoginForm(){
    alert(45);
    var userid = $('#userid').val();
    var password = $('#password').val();

    if(isNull(userid) && isNull(password)){
      $('#Login').attr('value','请输入账号和密码!!!').css('background','red');
      return false;
    }
    if(isNull(userid)){
      $('#Login').attr('value','请输入账号!!!').css('background','red');
      return false;
    }
    if(isNull(password)){
      $('#Login').attr('value','请输入密码!!!').css('background','red');
      return false;
    }
    alert(98679);
    $.ajax({
      type: "get",
      url: "/user/login?userid="+userid+"&password="+password,
      async: true,
      contentType: "application/json;charset=utf-8",
      dataType: "json",
      success:function (obj) {

        var status =obj.status;
        if (status=="false"){
          var msg = obj.msg;
          alert(msg);
        }else {
          //登录成功
          location.href="/demo/friend.html";
        }

      }
    });
  }

  /**
   * check the param if it's null or '' or undefined
   * @param input
   * @returns {boolean}
   */
  function isNull(input){
    if(input == null || input == '' || input == undefined){
      return true;
    }
    else{
      return false;
    }
  }
</script>
</body>
</html>